<template>
  <layoutBlock >
    <div class="content">
      <div class="">
        <Input class="mb10" search v-model="condition.keyword" placeholder="请输入用户名名称" @on-search="getData" />
        <Button class="ml10 fr"  @click="getEdit('',true)"><Icon type="md-add" />新增用户名</Button>
        <Button class="ml10 fr" type="error" @click="delAll">删除</Button>
      </div>
      <Table :loading="loading" @on-selection-change="selectList" border class="mt20" ref="selection" :columns="columns2" :data="data1">

        <template slot-scope="{ row, index }" slot="regdate" >
          <span>{{moment(row.regdate)?moment(row.regdate).format('YYYY-MM-DD'):'-'}}</span>
        </template>
        <template slot-scope="{ row, index }" slot="action" >
          <span class="cursor cr2d8cf0" @click="getEdit(row,false)">编辑</span>
          <span class="cursor cr2d8cf0" @click="getResetPwd(row,1)">重置密码</span>
          <span class="cursor cr2d8cf0" @click="getDel(row,1)">删除</span>
        </template>
      </Table>
      <div class="disflex mt30">
        <Page :total="total" v-if="total>condition.limit"  :current="condition.start" show-elevator @on-change="changepage"></Page>
      </div>
      <Modal :mask-closable="false" footer-hide  v-model="isShow":title="isAdd?'新增用户名':'编辑用户名'" width="500">
        <userEditor :jurisdictionList="jurisdictionList" :orgList="orgList" :list="statusList" :isAdd="isAdd" :editorData="editorData" v-if="isShow" @success="success"></userEditor>
      </Modal>
      <Modal
          v-model="isShow2"
          title="删除"
          @on-ok="getDel('',2)"
          @on-cancel="cancel" width="350">
        <div class="input-item">
          该用户名将被删除, 是否继续?
        </div>
      </Modal>
      <Modal
          v-model="resetPwdUser.show"
          title="重置密码"
          @on-ok="getResetPwd('',2)"
          @on-cancel="cancel" width="350">
        <div class="input-item">
          用户：{{resetPwdUser.name}}[{{resetPwdUser.phone}}] 的密码将被重置, 是否继续?
        </div>
      </Modal>
    </div>
  </layoutBlock>
</template>
<script>
import userEditor from '../../components/userManage/userEditor';
import {userType,userList,userDel,userInitPwd} from '@/api/userManage';
import {regionTree,orgTree} from '@/api/base'
import tool from "../../libs/tool";
import base from '@/mixins/base';
export default {
  mixins: [base],
  components:{userEditor},
  data () {
    return {
      loading:false,
      total:0,//总条数
      roleId:'',
      editorData:{},
      title:'编辑',
      statusList:[],
      condition:{//头部筛选传参
        keyword:'',
        limit:10,
        start:1,
        is_enable:'',
      },

      columns2: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '姓名',
          key: 'name'
        },
        {
          title: '手机号',
          key: 'phone',

        },
        {
          title: '隶属公司',
          key: 'orgName',
          ellipsis:true
        },
        // {
        //   title: '家庭住址',
        //   key: 'address',
        //   ellipsis:true
        // },
        {
          title: '设置权限',
          key: 'typeName',
        },
        {
          title: '创建时间',
          key: 'createdAt',
        },
        {
          title: '操作',
          slot: 'action',
          width:200,
          align: 'center'
        }
      ],
      data1: [],
      isShow:false,
      isShow2:false,
      isShow3:false,
      isShow4:false,
      detail:'',
      ids:'',
      isAdd:true,
      noShow:false,
      userId:'',
      isShowUser:false,
      selectlist:[],
      orgList:[],
      jurisdictionList:[],
      showResetPwd:false,
      resetPwdUser:{
        show:false,
        id:'',
        name:'',
        phone:''
      }
    }
  },
  created(){
    this.getType();
    this.getData();
    this.getRegionTree();
    this.getOrgTree();
  },
  filters:{
    format(arr){//这里不能用类似与formatDepts 驼峰命名 不然模版中使用会编译报错
      let res= (arr||[]).map(item=>{
        return item.name
      })
      return res.join('、')
    },
    getSex:function (value){
      if(value==1){
        return '男'
      }else if(value==2){
        return '女'
      }else {
        return '未知'
      }
    }
  },
  methods: {
    async getOrgTree(){
      let res= await orgTree({});
      this.orgList=tool.formatTree(_.get(res,'data')||[],'children','lable','id',false,false);
    },
    async getRegionTree() {
      let res= await regionTree({});
      this.statusList=tool.formatTree(_.get(res,'data')||[],'children','lable','id',false,false);

    },
    async getType(){
      let res = await userType({});
      this.jurisdictionList= _.get(res,'data')||[];
    },
    selectList(value){
      this.condition.start=1;
      this.selectlist=value
    },
    delAll(){
      let arr= this.selectlist.map(item=>{
        return item.id
      })
      if(arr.length==0){
        this.$Message.warning('请先选择用户名！')
        return
      }
      this.getDel({id:arr.join()},1)
    },
    success(){
      this.getData();
      this.isShow=false;
      this.isShow03=false;
    },
    //获取列表
    async getData(){
      this.loading=true;
      let  res =!this.orgIds?this.defaultListData: await  userList({...this.condition ,pOrgId:this.orgIds});
      this.loading=false;
      this.data1= _.get(res,'data.records') ||[];
      this.total=_.get(res,'data.total')||0;
    },
    //分页userType
    changepage(page){
      this.condition.start = page
      this.getData()
    },
    getEdit(row,types){
      this.isAdd=types;
      this.isShow = true;
      if(types) return;
      let {address,name,id,type,sex} = row;
      let regionCode=[];
      if(row.province) regionCode.push(row.province);
      if(row.city) regionCode.push(row.city);
      if(row.district) regionCode.push(row.district);
      this.editorData={address,name,id,regionCode,type,sex}
    },
    async getDel(row,type){
      if(type==1){
        this.ids = row.id
        this.isShow2 = true;
      }else{
        let res = await userDel({userIds:this.ids});
        if(_.get(res,'code')==0){
          this.isShow2 = false;
          this.$Message.success('删除成功')
          this.getData();
        }else{
          this.$Message.error(_.get(res,'message')||'删除失败！')
        }
      }
    },
    async getResetPwd(row,type){
      if(type==1){
        this.resetPwdUser.id = row.id;
        this.resetPwdUser.name = row.name;
        this.resetPwdUser.phone = row.phone;
        this.resetPwdUser.show = true;
      }else{
        let res = await userInitPwd({id:this.resetPwdUser.id});
        if(_.get(res,'code')==0){
          this.resetPwdUser.id = '';
          this.resetPwdUser.name = '';
          this.resetPwdUser.phone = '';
          this.resetPwdUser.show = false;
          this.$Message.success('密码重置成功')
        }else{
          this.$Message.error(_.get(res,'message')||'密码重置失败！')
        }
      }
    },

    cancel(){},
  }
}
</script>

<style scoped lang="less">

</style>
